<template>
  <div>
    <h1>子组件</h1>
    <h3>父组件传递的值：{{ msg }}</h3>
    <n-button @click="toEmits">传值</n-button>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue';
interface Props {
  msg?: string
}

//使用默认值
const props = withDefaults(defineProps<Props>(),{
  msg: 'hello'
})
const name = ref('woshididi')
const emits = defineEmits(['childFn']);
const toEmits = () => {
  emits('childFn',name)
}
//使用ref  在子组件中script setup 默认不暴露任何数据，如果需要用到子组件的值你需要使用 defineExpose api
defineExpose({
  name
})
</script>

<style scoped>

</style>